<template>
	<div>
		<div ref="dialogBox"
		     class="dialog"
		     :class="'dialog-'+animation">
			<div class="dialog-header">{{title}}</div>
			<div class="dialog-body">
				<div v-html="msg"></div>
				<input v-if="input"
				       type="text"
				       :placeholder="placeholder"
				       v-model="inputValue">
			</div>
			<div class="dialog-footer">
				<div v-for="(btn,index) in buttons"
				     :key="index"
				     @click="btnClick(index,btn)"
				     class="dialog-btn"
				     tapmode>{{btn}}</div>
			</div>
		</div>
		<div class="mask"
		     :class="'mask-'+animation"></div>
	</div>
</template>
<script>
let callBack = {};
export default {
  data() {
    return {
      animation: 'out',
      type: '',
      title: '',
      msg: '',
      buttons: [],
      input: false,
      placeholder: '',
      inputValue: '',
    };
  },
  mounted() {
  },
  methods: {
    alert(options, cb) {
      this.type = 'alert';
      if (typeof options === 'string') {
        this.msg = options;
        this.buttons = ['确定'];
      } else if (typeof options === 'object') {
        this.title = options.title || '';
        this.msg = options.msg || '';
        this.buttons = options.buttons || ['确定'];
      }
      this.animation = 'in';
      callBack.alertCallBack = cb;
    },
    confirm(options, okCB, cancelCB) {
      this.type = 'confirm';
      if (typeof options === 'string') {
        this.msg = options;
        this.buttons = ['取消', '确定'];
      } else if (typeof options === 'object') {
        this.title = options.title || '';
        this.msg = options.msg || '';
        this.buttons = options.buttons || ['取消', '确定'];
      }
      this.animation = 'in';
      callBack.confirmOkCallBack = okCB;
      callBack.confirmCancelCallBack = cancelCB;
    },
    prompt(options, okCB, cancelCB) {
      this.type = 'prompt';
      this.input = true;
      if (typeof options === 'string') {
        this.msg = options;
        this.buttons = ['取消', '确定'];
      } else if (typeof options === 'object') {
        this.title = options.title || '';
        this.msg = options.msg || '';
        this.placeholder = options.placeholder || '';
        this.buttons = options.buttons || ['取消', '确定'];
      }
      this.animation = 'in';
      callBack.promptOkCallBack = okCB;
      callBack.promptCancelCallBack = cancelCB;
    },
    custom(options = {}, cb) {
      this.type = 'custom';
      if (typeof options === 'string' || Object.keys(options).length === 0) {
        throw new Error("请定义dialog参数{title:'',msg:'',buttons:[]}");
      }
      this.title = options.title || '';
      this.msg = options.msg || '';
      this.buttons = options.buttons || ['取消', '确定'];
      this.animation = 'in';
      callBack.customCallBack = cb;
    },
    close() {
      this.animation = 'out';
      callBack = {};
      this.type = '';
      this.title = '';
      this.msg = '';
      this.buttons = [];
      this.input = false;
      this.inputValue = '';
      this.placeholder = '';
    },
    btnClick(index) {
      switch (this.type) {
        case 'alert':
          if (callBack.alertCallBack) callBack.alertCallBack();
          this.close();
          break;
        case 'confirm':
          if (index === 1 && callBack.confirmOkCallBack && callBack.confirmOkCallBack()) {
            this.close();
          } else if (index === 0) {
            if (callBack.confirmCancelCallBack)callBack.confirmCancelCallBack();
            this.close();
          }
          break;
        case 'prompt':
          if (index === 1 && callBack.promptOkCallBack && callBack.promptOkCallBack(this.inputValue)) {
            this.close();
          } else if (index === 0) {
            if (callBack.promptCancelCallBack)callBack.promptCancelCallBack();
            this.close();
          }
          break;
        case 'custom':
				  if (callBack.customCallBack && callBack.customCallBack(index)) {
            this.close();
          }
          break;
        default:
          this.close();
          break;
      }
    },
  },
};
</script>
<style lang="less">
</style>
